<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>cookie验证  <span>未登录</span></h1>
    <button onclick="login()" class="login">登录</button>
    <button class="outlogin">退出登录</button>

    <h3>客户端操作cookie</h3>
    <button onclick="setCookie()">客户端设置cookie</button>
    <button onclick="getCookie()">客户端获取cookie</button>
    <button onclick="removeCookie()">删除指定cookie</button>
</body>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.2/jquery.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<script>
  function login(){
    window.location.href = './login.html'
  }
//   发送请求判断当前用户是否登录
 $.ajax({
    url:"/isLogin",
    method:"get",
    success(data){
        console.log(data)
        if(data.code===0){
            $("span").text("已登录")
            $(".login").css("display","none")
            $(".outlogin").css("display","block")
        }else{
            $("span").text("未登录")
            $(".login").css("display","block")
            $(".outlogin").css("display","none")
        }
    },
    error(err){
        console.log(err)
        
    }
 })
 $('.outlogin').click(()=>{
    $.ajax({
        url:"/outLogin",
        method:"get",
        success(res){
            console.log(res)
            // 刷新页面
            location.reload();
        },
        error(err){
            console.log(err)
        }
    })
 })

//   客户端操作cookie
function setCookie(){
    // $.cookie("属性名","属性值")
    $.cookie("username","lzq")
    $.cookie("age",18)
}

function getCookie(){
    // 获取指定cookie
    let username = $.cookie("username");
    console.log(username)
}
function removeCookie(){
    $.removeCookie("age")
}
</script>
</html>